<!DOCTYPE html>
<html class="loading" lang="en" data-textdirection="ltr">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimal-ui">
    <meta name="author" content="PIXINVENT">
    <title>999后台管理系统</title>
    <script src="./js/Http.js"></script>
    <script src="./js/jquery.js"></script>
    <script src="./js/vue.js"></script>
</head>
<body>
    <div id="app">
      <table>
        <tr>
            <th>用户名</th>
            <th>性别</th>
            <th>联系方式：</th>
            <th>地址：</th>
        </tr>
        <tr v-for="(item,index) in productMessage " :key="item.productId">
           <td>{{item.productId}}</td>
           <td>{{item.productName}}</td>
           <td>{{item.productPrice}}</td>
        </tr>
    </table>
    </div>
</body>
</html>
<script>
$(function() {
  selectAll("", "", 1);
});
var productMessage = []
function selectAll(productName, supplierName, pageNum) {
  $.ajax({
      'url': HTTP.getUserInfo + '/products',
      'type': 'get',
      'dataType': 'json',
      'data': { productName, supplierName, pageNum },
      'success': function(data) {
        console.log(data);
        productMessage = data.data.list;
        console.log(productMessage);
      }
  });
}

new Vue({
  el: '#app',
  data: {
    productMessage: productMessage
  },
  methods: {

  }
})
</script>